<!DOCTYPE html>
<html>
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewpoint" content="width=device-width,initial-scale=1.0">
        <title>
            注册页面
        </title>
        <link rel="stylesheet" href="css/login.css">
        <script src="vue.js"></script>
        <script src="jquery.1.8.js"></script>
    </head>
    <body style="background-image: url(images/jingdong.png);background-repeat:no-repeat;
    background-size: cover;">
    </body>
    
    <body>
        <div id="app">
        <div class="out" >
            <div class="top"  >
            用户注册
            <img src="images/untitled.png" >
            </div>
            <div class="text">
                <input type="text" v-model="loginName" placeholder="请输入用户名"/>
            </div>
            <div class="text">
                <input type="password" v-model="pwd" placeholder="请输入密码"/>
            </div>
            <div class="text">
                <input type="text" v-model="name" placeholder="请输入姓名"/>
            </div>
            <div class="bottom" text-align="center" @click="register">
                注册
            </div>
        </div>
        </div>
    </body>

    <script>
        var vm=new Vue({
            el:'#app',
            data:{
                loginName:'',
                pwd:'',
                name:''
            },
            methods:{
                register(){
                    $.ajaxSetup({
                        contentType:"application/json;charset=utf-8"
                    });
                    var data ={'loginName':this.loginName,'pwd':this.pwd,'name':this.name}

                    $.post("http://api.tutestudio.net/api/reg",JSON.stringify(data),function(res){
                        if(res.code==200){
                            alert('注册成功')
                            location.href="work_01.html"
                        }
                        else{
                            alert("注册失败")
                        }
                    })
                  
                }
            }
        })
    </script>

</html>